<template>
  <div>
    <mt-popup v-model="popupVisible" position="right" :modal="false" class="pop-page">
      <customHeader :middleTitle="detail.name" @leftCallBack="popupHide"/>
      <div class="scroll-view">
        <div class="scroll-ct page-body">
          <img class="img" :src="detail.imgUrl"/>
        </div>
      </div>
    </mt-popup>
  </div>
</template>

<script>
import customHeader from "@/components/header/header";

export default {
  components: {
    customHeader
  },
  data() {
    return {
      popupVisible: false
    };
  },
  props: {
    detail: {
      type: Object
    }
  },
  methods: {
    popupShow() {
      this.popupVisible = true;
    },
    popupHide() {
	    this.popupVisible = false;
    }
  }
};
</script>

<style lang="scss" scoped>
@import "../../../style/public";
.pop-page {
  width: 100%;
  height: 100%;
  .img {
    width: 100%;
    height: auto;
    @include remCalc(margin-bottom, 20);
  }
}
</style>